<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>
<head>
<meta name="keywords" content="" />
<meta name="description" content="" />
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>Doctaskis</title>
<link href="../css/style.css" rel="stylesheet" type="text/css" />
<link href="../plugins/flexigrid/css/flexigrid.css" rel="stylesheet" type="text/css" />
<link href="../css/documentstyle.css" rel="stylesheet" type="text/css" media="screen" />
<link href="../css/jquery-ui.min.css" rel="stylesheet" type="text/css" media="screen" />
<script src="../js/jquery-1.7.2.min.js"></script>
<script src="../js/jquery-ui-1.10.3.custom.js"></script>
<script src="../plugins/flexigrid/js/flexigrid.js"></script>

<script>
function test(){
	alert("go here1");
}
$(function() {

	var locUpdateTaskID;
	//添加jquery效果
	$("input:submit,input:reset,button").button();
	//设置时间弹出时间框
	$("#starttime").datepicker({ currentText: "Now" });
	$("#endtime").datepicker({ currentText: "Now" });
	$( "#starttime" ).datepicker("setDate",new Date());
	$( "#endtime" ).datepicker("setDate",new Date());
	//设置对话框效果
	 $( "#taskDialog" ).dialog({
      autoOpen: false,
      show: {
        effect: "blind",
        duration: 1000
      },
      hide: {
        effect: "explode",
        duration: 1000
      }
    });
   
    
	function addAction(){
		$( "#taskDialog" ).dialog({title:"添加日程"});
		$( "#addTaskBtn").show();
		$( "#updateTaskBtn").hide();
	  	$( "#taskDialog" ).dialog( "open" );  	
	}
	
	function delAction(com,grid){
		selected_count = $('.trSelected', grid).length;
		if (selected_count == 0) 
		{
			alert('请选择日程!');
			return;
		}
		names = '';
		$('.trSelected td:nth-child(2) div', grid).each(function(i) 
		{
		if (i) names += ',';
		names += $(this).text();
		});
		ids = '';
		$('.trSelected td:nth-child(1) div', grid).each(function(i) 
		{
		if (i) ids += ',';
		ids += $(this).text();
		});
		if (confirm("确定删除日程[" + names + "]?")) 
		{
		  delTask(ids);
		}
	}
	
	function editAction(com,grid){
		selected_count = $('.trSelected', grid).length;
		if (selected_count == 0) 
		{
			alert('请选择一个日程!');
			return;
		}
		if (selected_count > 1) 
		{
			alert('只可更新一个日程!');
			return;
		}
		names = '';
		$('.trSelected td:nth-child(2) div', grid).each(function(i) 
		{
		if (i) names += ',';
		names += $(this).text();
		});
		ids = '';
		$('.trSelected td:nth-child(1) div', grid).each(function(i) 
		{
		if (i) ids += ',';
		ids += $(this).text();
		});
		if (confirm("确定更新日程[" + names + "]?")) 
		{
		  editTask(ids);
		}
	}
	
	function editTask(ids)
	{
		locUpdateTaskID =ids;
		$( "#taskDialog" ).dialog({title:"更新日程"});
		$( "#addTaskBtn").hide();
		$( "#updateTaskBtn").show();
	  	$( "#taskDialog" ).dialog( "open" );
	}
	function delTask(ids) 
	{
		$.ajax
		({
			url : '../task.do?actMethod=deleteTaskAction',
		    data : { taskids : ids},
		    type : 'POST',
		    success: function(msg){
				if(msg=="success"){
					$("#tasksTable").flexReload();
				}else{
					alert("Oh no!error:"+msg);
				}
			},
			error: function(msg){
				alert(msg);
			}
		 });
	}
	
	 $('#tasksTable').flexigrid( {
		url: '../task.do?actMethod=showAllTask',
		dataType: 'json',
		colNames:['ID','日程名','开始时间','结束时间','优先级'],
		colModel : [
			{display: 'ID', name : 'id', width : 60, sortable : true, align: 'center'},
			{display: '日程名', name : 'name', width : 333, sortable : true, align: 'center'},
			{display: '开始时间', name : 'starttime', width : 220, sortable : true, align: 'left'},
			{display: '结束时间', name : 'endtime', width : 220, sortable : true, align: 'left'},
			{display: '优先级', name : 'priority', width : 60, sortable : true, align: 'left'}
			],
		buttons : [
			{name: '添加日程', bclass: 'add', onpress : addAction},
			{name: '更新日程', bclass: 'edit', onpress : editAction},
			{name: '删除日程', bclass: 'delete', onpress : delAction},
			{separator: true}
			],
		searchitems : [
			{display: 'ID', name : 'id',isdefault: true},
			{display: '日程名', name : 'name'}
			],
		sortname: "id",
		sortorder: "asc",
		usepager: true,
		title: 'Tasks',
		useRp: true,
		rp: 2,
		showTableToggleBtn: true,
		width: 30,
		height: 200
    }); 
   
     $( "#addTaskBtn" )
		.button()
		.click(function() {
			var taskName = $("#taskName").val();
			var startTime = $("#starttime").val();
			var endTime = $("#endtime").val();
			var priorityID = $("#priorityID").val();
			$.ajax
			({
				url : '../task.do?actMethod=addTaskAction',
			    data : { taskname : taskName,starttime:startTime,endtime:endTime,priorityid:priorityID},
			    type : 'POST',
			    success: function(msg){
					if(msg=="success"){
						$("#tasksTable").flexReload();
						alert("添加成功！");
						$( "#taskDialog" ).dialog( "close" );  	
					}else{
						alert("Oh no!error:"+msg);
					}
				},
				error: function(msg){
					alert(msg);
				}
			 });
	});
	$( "#updateTaskBtn" )
		.button()
		.click(function() {
			var taskName = $("#taskName").val();
			var startTime = $("#starttime").val();
			var endTime = $("#endtime").val();
			var priorityID = $("#priorityID").val();
			$.ajax
			({
				url : '../task.do?actMethod=updateTaskAction',
			    data : { taskid:locUpdateTaskID,taskname : taskName,starttime:startTime,endtime:endTime,priorityid:priorityID},
			    type : 'POST',
			    success: function(msg){
					if(msg=="success"){
						$("#tasksTable").flexReload();
						alert("更新成功！");
						$( "#taskDialog" ).dialog( "close" );  	
					}else{
						alert("Oh no!error:"+msg);
					}
				},
				error: function(msg){
					alert(msg);
				}
			 });
	});
});//jQuery("#select1  option:selected").text();
</script>
<style type="text/css">
#tasksField{
	background-color: #FFF;
	width: 958px;
	margin: 0 auto;
	text-align: center;
}
#tasksField p{
	color:#000;
	text-align:left;
	padding-top:20px;
	padding-left:30px;
}
</style>
</head>
<body>
<!--<input id="tasksInfo" type="hidden" value="${friendInfo}"/>-->
<div id="wrapper">
	<div id="header">
		<div id="logo">
			<h1><a href="#">doctaskis </a></h1>
			<p> BY AVERY HUO</p>
		</div>
		<div id="menu">
			<ul>
				<li><a href="../main.do">首页</a></li>
				<li><a href="../documentLibrary.do?actMethod=showDocumentLibraryAction">文档库</a></li>
				<li class="first current_page_item"><a href="TaskManagement.jsp">日程表</a></li>
				<li><a href="FriendManagement.jsp">朋友们</a></li>
				<li><a href="#">关于我</a></li>
				<li><a href="#">关于这</a></li>
			</ul>
		</div>
        <div id="userinfo">
           		<a id="userWelcome">Hi,${sessionScope.username}</a>
                <a id="signout" href="../user.do?actMethod=quitUserAction">Sign out</a>
                <a id="register" href="register.jsp">Register</a>
         </div>
	</div>
	<!-- end #header -->
 
  <div id="tasksField">

	<table id="tasksTable" style="color:black;"></table>
	
	
	<!-- end #content -->
	<div style="clear: both;">&nbsp;
	</div>
			
	<!-- end #page -->
  </div>
  <div id="taskDialog">
   		日程名：<input id="taskName" type="text" value="新日程"/><br/>
   		开始时间：<input id="starttime" type="text"/><br/>
   		结束时间：<input id="endtime" type="text"/><br/>
   		优先级：<select id="priorityID"> 
   			 	<option value="1">高</option>
   			 	<option value="2">中</option>
   			 	<option value="3">级</option>
   			 	</select> <br/>
    	<button id="addTaskBtn">添加</button>
    	<button id="updateTaskBtn">更新</button>
   </div>
</div>
<div id="footer">
	<p>Copyright (c) 2013 Avery.com. All rights reserved. Design by Avery.</p>
</div>
<!-- end #footer -->
</body>
</html>
